<template>
    <view class="container">
        <view class="header">
            <view class="title">大型招聘会,海量简历等您来</view>
            <view class="content"></view>
        </view>

        <view class="step">
            <view class="title">
                目前已有超
                <text style="color: #eb4f38">1000+企业入驻</text>
            </view>
            <view class="content"></view>
            <view class="list">
                <view class="item"><view>1</view></view>
                <view class="itemtitle">
                    <view>支付入驻费</view>
                    <view>完成入驻费,平台工作人员会主动联系您</view>
                </view>
            </view>

            <view class="list">
                <view class="item"><view>2</view></view>
                <view class="itemtitle">
                    <view>提供企业资料</view>
                    <view>如LOGO、宣传图、企业简介等</view>
                </view>
            </view>

            <view class="list">
                <view class="item"><view>3</view></view>
                <view class="itemtitle">
                    <view>一对一顾问</view>
                    <view>全程一对一服务，帮企业最大限度获得人才</view>
                </view>
            </view>

            <view class="list">
                <view class="item"><view>4</view></view>
                <view class="itemtitle">
                    <view>评估效果</view>
                    <view>根据企业实际情况,定向推荐优秀人才</view>
                </view>
            </view>
        </view>
        <form @submit="pay" report-submit>
            <view class="joinbtn">
                <button formType="submit">立即支付￥{{ activeinfo.money }}</button>
            </view>
        </form>
    </view>
</template>

<script>
import { Active } from '../../model/active-model.js';
var active = new Active();
import { Order } from '../../model/order-model.js';
var order = new Order();
import { Pay } from '../../model/pay-model.js';
var pay = new Pay();
export default {
    data() {
        return {
            id: 0,

            activeinfo: {
                money: ''
            }
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (e) {
        var that = this;
        if (that.id > 0) {
            var id = that.id;
        } else {
            var id = e.id;
            that.id = e.id;
        }
        uni.setNavigationBarTitle({
            title: '报名招聘会'
        });
        var params = {
            id: that.id
        };
        uni.setNavigationBarColor({
            frontColor: '#ffffff',
            backgroundColor: '#f0412c',
            animation: {
                duration: 400,
                timingFunc: 'easeIn'
            }
        });
        active.GetActivedetail((data) => {
            that.setData({
                activeinfo: data.activeinfo
            });
        }, params);
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        toPayactive: function () {
            var that = this;
            var id = that.id;
            uni.navigateTo({
                url: '/pages/payactive/index?id=' + id
            });
        },

        pay: function (e) {
            var that = this;
            var pid = that.id;
            var companyid = uni.getStorageSync('companyid');
            if (pid > 0 && companyid > 0) {
                var params = {
                    pid: pid,
                    type: 'companyactive',
                    companyid: companyid
                };
                order.Activeorder((data) => {
                    pay.execPay(data.order_id, (res) => {
                        uni.navigateBack();
                    });
                }, params);
            } else {
                uni.showModal({
                    title: '提示',
                    content: '数据错误',
                    showCancel: false
                });
                return;
            }
        }
    }
};
uni.makeBluetoothPair({
    deviceId: 'deviceId',
    pin: 'pin',
    timeout: 0,
    success: (res) => {},
    fail: (res) => {},
    complete: (res) => {}
});
</script>
<style>
page {
    background-color: #fff;
}
.container {
    background-color: #fff;
}
.container .header {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.container .header .title {
    font-size: 1.2rem;
    font-weight: 600;
    padding-top: 30rpx;
}
.container .header .content {
    font-size: 0.9rem;
    padding-top: 20rpx;
    color: #868686;
}
.container .header .logo {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 620rpx;
    margin-top: 60rpx;
    flex-wrap: wrap;
}

.container .header .logo image {
    width: 125rpx;
    height: 125rpx;
    border-radius: 50%;
    margin-bottom: 80rpx;
}

.container .step {
    width: 100%;
    display: flex;
    flex-direction: column;

    background: #f6fbf5;
    padding-bottom: 20rpx;
}
.container .step .title {
    font-size: 1.2rem;
    font-weight: 600;
    padding-top: 30rpx;
    align-self: center;
}
.container .step .content {
    font-size: 0.9rem;
    padding-top: 20rpx;
    color: #868686;
    align-self: center;
    margin-bottom: 20rpx;
}
.container .step .list {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    margin-top: 30rpx;
}
.container .step .list .item {
    height: 100rpx;
    width: 100rpx;
    display: flex;
    justify-content: center;
    align-content: center;
    margin-left: 40rpx;
    margin-top: -10rpx;
}
.container .step .list .item view {
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: center;
    width: 60rpx;
    height: 60rpx;
    background: #eb4f38;
    color: #fff;
    border-radius: 75rpx;
    font-size: 0.8rem;
    font-weight: 600;
}

.container .step .list .itemtitle {
    color: #888d87;
    font-size: 0.8rem;
    display: flex;
    flex-direction: column;
    margin-left: 30rpx;
    height: 100rpx;
}

.container .step .list .itemtitle view:nth-child(1) {
    color: #888d87;
    font-size: 0.9rem;
    font-weight: 600;
}

.container .step .list .itemtitle view:nth-child(2) {
    color: #c0c2bd;
    font-size: 0.8rem;
}

.container .joinbtn {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-top: 50rpx;
    margin-bottom: 50rpx;
}

.container .joinbtn button {
    background: #eb4f38;
    color: #fff;
    font-size: 0.8rem;
    width: 600rpx;
    height: 80rpx;
    line-height: 80rpx;
}
.container .doagree {
    font-size: 0.7rem;
    margin-left: 50rpx;
    margin-top: 40rpx;
}

.content {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: center;
    margin-top: 20rpx;
}
.content .item {
    font-size: 0.8rem;
    width: 100%;
    align-self: center;
    margin-bottom: 10rpx;
    display: flex;
    flex-direction: row;
    justify-content: center;
}
.inputlist {
    border: 1rpx solid #efefef;
    width: 80%;
    height: 100rpx;
    line-height: 100rpx;
    border-radius: 4rpx;
    align-self: center;
}
</style>
